import { createRouter, createWebHistory } from 'vue-router'
import HomeView from '../views/HomeView.vue'
import PkView from '@/views/pk/PkView';
import RankListView from '@/views/pk/RankListView';
import BotView from '@/views/user/bot/BotView';
import LoginView from '@/views/user/LoginView';
import RegisterView from '@/views/user/RegisterView';
import UserInfoView from '@/views/user/UserInfoView';
import NotFoundView from '@/views/error/NotFoundView';
import RecordView from '@/views/pk/RecordView';
import RecordMp4 from '@/views/pk/RecordMp4';
import MessageView from '@/views/message/MessageView';
import UserSpaceView from '@/views/user/UserSpaceView';
import PhotoAlbum from '@/components/user/space/PhotoAlbum';
import UserTextList from '@/components/user/space/UserTextList';
import EditEssay from '@/components/user/space/EditEssay';
import UserEssayView from '@/views/user/UserEssayView';
import WEditorUpdate from '@/components/WEditorUpdate';
import AlbumList from '@/components/user/space/AlbumList';
import OpenAi from '@/components/user/space/OpenAi';

import store from '../store/index'

const routes = [
  {
    path: '/',
    name: 'home',
    component: HomeView
  },
  {
    path: '/pk',
    name: 'pk',
    component: PkView,
    meta: {
      requestAuth: true,
    }
  },
  {
    path: '/ranks',
    name: 'ranks',
    component: RankListView,
    meta: {
      requestAuth: true,
    }
  },
  {
    path: '/bot',
    name: 'bot',
    component: BotView,
    meta: {
      requestAuth: true,
    }
  },
  {
    path: '/login',
    name: 'login',
    component: LoginView
  },
  {
    path: '/register',
    name: 'register',
    component: RegisterView
  },
  {
    path: '/userinfo',
    name: 'userinfo',
    component: UserInfoView,
    meta: {
      requestAuth: true,
    }
  },
  {
    path: '/userspace/:userId',
    name: 'userspace',
    component: UserSpaceView,
    meta: {
      requestAuth: true,
    },
    children: [
      {
        path: 'album',
        name: 'album',
        component: PhotoAlbum,
        meta: {
          requestAuth: true,
        }
      },
      {
        path: 'essays',
        name: 'essays',
        component: UserTextList,
        meta: {
          requestAuth: true,
        }
      },
      {
        path: 'ai',
        name: 'ai',
        component: OpenAi,
        meta: {
          requestAuth: true,
        }
      },
    ]
  },
  {
    path: '/editessay',
    name: 'editessay',
    component: EditEssay,
    meta: {
      requestAuth: true,
    }
  },
  {
    path: '/essay/:userId',
    name: 'essay',
    component: UserEssayView,
    meta: {
      requestAuth: true,
    }
  },
  {
    path: '/essayupdate/:essayId',
    name: 'essayupdate',
    component: WEditorUpdate,
    meta: {
      requestAuth: true,
    }
  },
  {
    path: '/message',
    name: 'message',
    component: MessageView,
    meta: {
      requestAuth: true,
    }
  },
  {
    path: '/record',
    name: 'record',
    component: RecordView,
    meta: {
      requestAuth: true,
    }
  },
  {
    path: '/record/:recordId',
    name: 'record_content',
    component: RecordMp4,
    meta: {
      requestAuth: true,
    }

  },
  {
    path: "/albumlist",
    name: "albumlist",
    component: AlbumList,
    meta: {
      requestAuth: true,
    }
  },
  {
    path: '/404',
    name: '404',
    component: NotFoundView
  },
  {
    path: '/:catchAll(.*)',
    redirect: '/404'
  }
]

const router = createRouter({
  history: createWebHistory(),
  routes
})

router.beforeEach((to, from, next) => {
  const temp = localStorage.getItem('userinfo');
  const access = localStorage.getItem('access');
  const refresh = localStorage.getItem('refresh');

  if (temp && access && refresh) {
    store.commit("updateUserInfoByLoc", JSON.parse(temp))
    store.commit("updateToken", {
      access,
      refresh,
    })
  }

  if (to.meta.requestAuth && !store.state.user.info.is_login) {
    next({ name: "login" });
  } else {
    next();
  }
})
export default router
